import { useRoutes } from "react-router";
import Basics from './view/Basics'
import Demo01 from './view/Demo01'
import Demo02 from './view/Demo02'
import Demo03 from './view/Demo03'
import Demo04 from './view/Demo04-Camera'
import Demo05 from './view/Demo05-Light'
import Demo06 from './view/Demo06-Animate'
import Demo07 from './view/Demo07'
import Demo08 from './view/Demo08-选择物体'
import Demo09 from './view/Demo09-Ray'
import Demo10 from './view/Demo10-Sprite'
import Demo11 from './view/Demo11-Particles'
import Demo12 from './view/Demo12-环境'
import Demo13 from './view/Demo13-着色器'
import './App.css';

const App: React.FC = () => {
  const routing = useRoutes([
    {
      path: "/",
      element: <Basics />
    }, {
      path: "Demo01",
      element: <Demo01 />
    }, {
      path: "Demo02",
      element: <Demo02 />
    }, {
      path: "Demo03",
      element: <Demo03 />
    }, {
      path: "Demo04-Camera",
      element: <Demo04 />
    }, {
      path: "Demo05-Light",
      element: <Demo05 />
    }, {
      path: "Demo06-Animate",
      element: <Demo06 />
    }, {
      path: "Demo07",
      element: <Demo07 />
    }, {
      path: "Demo08-选择物体",
      element: <Demo08 />
    }, {
      path: "Demo09-Ray",
      element: <Demo09 />
    }, {
      path: "Demo10-Sprite",
      element: <Demo10 />
    }, {
      path: "Demo11-Particles",
      element: <Demo11 />
    }, {
      path: "Demo12-环境",
      element: <Demo12 />
    }, {
      path: "Demo13-着色器",
      element: <Demo13 />
    }
  ]);
  return <>{routing}</>;
};

export default App;